// 购物车模块
import { insertCart, findCartList, deleteCart, updateCart, checkAllCart } from '@/api/cart'
const cart = {
  namespaced: true,
  // 定义数据
  state: () => ({
    cartList: [] // 购物车列表
  }),
  // 基于state的计算属性
  getters: {
    // 数组中每一项的count之和 累加起来
    allCount (state) {
      return state.cartList.reduce((a, c) => a + c.count, 0)
    },
    // 已选择数量: 把列表中所有selected为true的项count值加起来
    selectedCount (state) {
      return state.cartList
        .filter(item => item.selected) // 筛选
        .reduce((a, c) => a + c.count, 0) // 累加
    },
    // 已选择商品价格合计: 把列表中所有selected为true的项 count * price 累加
    selectedPrice (state) {
      return state.cartList
        .filter(item => item.selected) // 筛选
        .reduce((a, c) => a + c.count * c.price, 0) // 累加
    },
    // 数组中的每一项中count*price 累加起来
    allPrice (state) {
      return state.cartList.reduce((a, c) => a + c.count * c.price, 0)
    },
    // 是否全选
    isAll (state) {
      return state.cartList.every(item => item.selected === true)
    }
  },
  // 定义修改数据的方法
  mutations: {
    setList (state, list) {
      state.cartList = list
    },
    // 用来修改选中状态的mutation
    singleCheck (state, { skuId, selected }) {
      // 1. 先用skuId做查找找到要修改的项 find findIndex?
      const item = state.cartList.find(item => item.skuId === skuId)
      // 2. 把传过来的最新的selected修改到对应的项的位置
      item.selected = selected
    }
  },
  // 定义异步方法
  actions: {
    // 流程：1.调用加入购物车接口 -> 后端生成一个购物车列表 -> 2.调用购物车列表拿到最新数据
    // 3. 调用mutation函数把拿到的购物车列表存入vuex
    async insertCart (ctx, { skuId, count }) {
      // 加入购物车接口
      await insertCart({ skuId, count })
      // 获取购物车列表
      const res = await findCartList()
      // 拿到购物车列表数据 存入vuex
      ctx.commit('setList', res.data.result)
    },
    // 删除购物车
    async delCart (ctx, ids) {
      // 1. 调用删除接口
      // 2. 重新拉取购物车列表
      // 3. 再次把拉取到的列表存入vuex
      // ids 必须是一个数组
      await deleteCart(ids)
      const res = await findCartList()
      ctx.commit('setList', res.data.result)
    },
    // 单选
    async singleCheck (ctx, good) {
      // 1.调用单选接口
      await updateCart(good)
      // 获取购物车列表
      const res = await findCartList()
      // 拿到购物车列表数据 存入vuex
      ctx.commit('setList', res.data.result)
    },
    // 数量修改
    async countChange (ctx, good) {
      // 1.调用更新接口
      await updateCart(good)
      // 获取购物车列表
      const res = await findCartList()
      // 拿到购物车列表数据 存入vuex
      ctx.commit('setList', res.data.result)
    },
    // 全选
    async allCheck (ctx, selected) {
      // 1.调全选接口
      await checkAllCart({
        selected,
        ids: ctx.state.cartList.map(item => item.skuId)
      })
      // 获取购物车列表
      const res = await findCartList()
      // 拿到购物车列表数据 存入vuex
      ctx.commit('setList', res.data.result)
    }
  }
}

export default cart
